<template>
  <div>
    <!-- 加载中样式 -->
    <div v-loading="chartFlag" v-if="chartFlag"></div>
    <!-- 没有加载出来需要增加一个重新加载按钮 -->
    <div v-if="reload" style="position: relative; background-color: #fff" @click="refresh">
      <!-- <el-button type="primary">重新加载</el-button> -->
      <span class="refresh_btn">
        <i class="el-icon-refresh"></i>
      </span>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {}
  },
  props: ['chartFlag', 'reload'],
  created() {
    // console.log(this.chartFlag, this.reload)
  },
  methods: {
    refresh() {
      this.$emit('refreshF')
    },
  },
}
</script>
<style lang="scss" scoped>
div {
  width: 100%;
  height: 100%;
  min-height: 70px;
}
.refresh_btn {
  display: inline-block;
  padding: 5px;
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  i {
    font-size: 30px;
    color: #707070;
  }
  &:hover {
    background-color: #f2f2f2;
    border-radius: 50%;
  }
}
</style>
